<!--
 * @Descripttion: 
 * @version: 
 * @Author: Zuo
 * @Date: 2021-09-29 11:02:31
 * @LastEditors: Zuo
 * @LastEditTime: 2021-09-29 13:42:55
-->
<template>
  <i
    :class="`config iconfont icon-${src}`"
    :style="`color: ${theme === 'dark' ? 'white' : '#333'}`"
    alt="icon"
  />
</template>

<script lang="ts">
import { toRefs } from "vue";
import { theme } from "../../layout/scripts/theme";
export default {
  name: "icon",
  props: {
    src: {
      type: String,
      default:'index'
    },
  },
  setup(props: Readonly<{ src?: string; }>) {
    return {
      ...toRefs(props),
      theme,
    };
  },
};
</script>

<style lang="scss" scoped>
.config {
  font-size: 18px;
}
</style>